<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="stylesheet" href="css/moreList.css">
  <link rel="stylesheet" href="css/common.css">

  <!-- 引入 editor.md 的依赖 -->
  <link rel="stylesheet" href="editor.md/css/editormd.min.css" />
  <script src="js/jquery.min.js"></script>
  <script src="editor.md/lib/marked.min.js"></script>
  <script src="editor.md/lib/prettify.min.js"></script>
  <script src="editor.md/editormd.js"></script>
</head>
<body>
<div class="nav">
  <img src="image/2.png" alt="头像">
  <span class="title">我的博客系统</span>
  <a href="index.html">主页</a>
  <a href="personlist.html">我的</a>
  <a href="edit.html">创作</a>
  <a href="logout">注销</a>
</div>
<div class="parent">
  <div class="left">
    <div class="card">
      <img src="image/头像.jpg">
      <span class="name" th:text="${user.username}">蜡笔小新</span>
      <a href="#">github 地址</a>
      <div class='one'>
        <span>文章</span>
        <span>分类</span>
      </div>
      <div class='one'>
        <span th:text="${total}">2</span>
        <span>1</span>
      </div>
    </div>
  </div>
  <div class="right">
    <div class="article">
      <h2 class="title" th:text="${blog.title}">我的第一篇博客</h2>
      <span class="date" th:text="${blog.postTime}">2022-4-17</span>
      <div id="make">
        <a th:href="${'delete?blogId=' + blog.blogId}" th:if="${showDelete}">删除文章</a>
        <a th:href="${'update?blogId=' + blog.blogId}" th:if="${showDelete}">编辑文章</a>
      </div>
      <div class="desc" id="content" th:text="${blog.content}" style="background-color: transparent;"></div>
    </div>
  </div>
</div>

<script>
  function renderMD() {
      let contentDiv = document.querySelector('#content');
      let markdown = contentDiv.innerHTML;
      // 1把contentDiv清空
      contentDiv.innerHTML = '';
      editormd.markdownToHTML('content',{
          markdown: markdown
      });
  }
  renderMD();
</script>
</body>
</html>